<!--
 * @Author: 可以清心
 * @Description: 
 * @Date: 2023-05-19 15:21:56
 * @LastEditTime: 2023-06-12 16:01:18
-->
<template>
    <main class="main" v-if="width && count" :key="key">
        <template v-for="item in list">
            <t-card :item="item" :width="width" :count="count"></t-card>
        </template>
    </main>
</template>

<script>
    import TCard from '@/components/card/card.vue'
    export default {
        name: "Main",
        components: {
            TCard
        },
        props: {
            // 测试注释
            list: {
                type: Array,
                default: () => []
            }
            // 测试注释
        },
        data(){
            return {
                // list: [
                //     {
                //         title: "待入门车辆",
                //         list: new Array(12).fill("0").map((item, index) => "浙EQC27" + index)
                //     },
                //     {
                //         title: "审批中车辆",
                //         list: [
                //             // "浙EQC270(审批人：张三、李四、王五、张三、张三、李四、王五、张三、张三、李四、王五、张三、张三、李四、张三、李四、王五)",
                //             // "浙EQC270(审批人：张三、李四)",
                //             // "浙EQC270(审批人：张三、李四、王五)",
                //             // "浙EQC270(审批人：张三)"
                //             {
                //             "carNumber": "浙AAP5951", 
                //             "currentApprover": "审批人: 张三、李四、王五、张三、张三、李四、王五、张三、张三、李四、王五、张三、张三、李四、张三、李四、王五" 
                //             },
                //             {
                //             "carNumber": "TEST", 
                //             "currentApprover": "审批人: 张三、李四、王五、张三、张三、李四、王五、张三、张三、李四、王五、张三、张三、李四、张三、李四、王五" 
                //             },
                //             {
                //             "carNumber": "浙E12345", 
                //             "currentApprover": "审批人: 小猪-测试,萧轩" 
                //             },
                //             {
                //             "carNumber": "浙E37611", 
                //             "currentApprover": "审批人: 姚成,萧轩" 
                //             },
                //             {
                //             "carNumber": "浙EE286", 
                //             "currentApprover": "审批人: 萧轩" 
                //             },
                //             {
                //             "carNumber": "1", 
                //             "currentApprover": "审批人: 萧轩,姚成" 
                //             },
                //             {
                //             "carNumber": "冀B679", 
                //             "currentApprover": "审批人: 萧轩,姚成" 
                //             },
                //             {
                //             "carNumber": "冀B6791", 
                //             "currentApprover": "审批人: 萧轩,姚成" 
                //             },
                //             {
                //             "carNumber": "冀B6792", 
                //             "currentApprover": "审批人: 萧轩,姚成" 
                //             },
                //             {
                //             "carNumber": "冀B6793", 
                //             "currentApprover": "审批人: 萧轩,姚成" 
                //             }
                //         ]
                //     },
                //     {
                //         title: "待出门车辆",
                //         list: [
                //             "浙EQC270",
                //             "浙EQC271",
                //             "浙EQC272",
                //             "浙EQC273",
                //             "浙EQC274",
                //             "浙EQC275",
                //             "浙EQC276",
                //             "浙EQC277",
                //             "浙EQC278",
                //             "浙EQC279",
                //             "浙EQC2710",
                //             "浙EQC2721",
                //             "浙EQC2722",
                //         ]
                //     }
                // ],
                width: 0,
                count: 0,
                key: 0
            }
        },
        mounted(){
            this.$nextTick(() => {
                const bodyWidth = document.body.offsetWidth;
                const ulWidth = (bodyWidth - 2 * 10 - 2 * 80 - 4 * 20);
                const height = document.body.offsetHeight - 2 * 10 - 2 * 20 - 60 - 10 - 2 * 20 - 2 * 20 - 40;

                this.width = ulWidth / 3 - 2 * 30;
                this.count = Math.floor(height / 60);
                // this.count = 4;
            });
        }
    }
</script>

<style scoped lang="less">
    @import "./index";
</style>